<template>
  <div class="billBox">
    <div class="billBoxLeft">
      <div class="billTitle">{{ billData.title }}</div>
      <div class="billContext">
        {{ billData.context.name }} ： {{ billData.context.status }}
      </div>
    </div>
    <div class="billBoxRight">{{billData.num}} <span></span>
      <img src="../../../assets/images/goback.png" alt=""></div>
  </div>
</template>

<script>
export default {
  name: "BillHandler",
  data() {
    return {

    };
  },
  props: {
    billData: {
      type: Object,
    },
  },
  mounted() {
    
  },
  methods: {
    
  },
};
</script>

<style lang="stylus" rel="stylesheet/stylus" scoped>
.billBox{
  width 314px
  height 65px
  display flex
  justify-content space-between
  box-sizing border-box
  padding  12.5px 0
  margin 0 15.5px
  border-bottom 1px solid rgb(221,221,221)
  .billBoxLeft{
    height 65px
    .billTitle{
      height 23px
      line-height 23px
      font-size 15.5px
      font-weight bold
      color(51,51,51)
    }
    .billContext{
      line-height 23px
      height 23px
      font-size 13.5px
      color rgb(102,102,102)
    }
  }
  .billBoxRight{
    height 65px
    line-height 35px
    color #666666
    position relative
    span{
      border-radius 50%
      background-color #F95425
      width 6px
      height 6px
      display block
      position absolute
      top 9px
      left 6px
    }
    img{
      width 8px
      height 14px
    }
  }
}
</style>
